<template>
  <FISelect
    v-model="processKey"
    :options="processArr"
    popperClass="select-taskDefKey-class"
    :props="{ value: 'taskDefKey', label: 'taskName' }"
    :display-key="['taskName']"
    valueCustom="taskDefKey"
    clearable
    filterable
    usePagination
    remote
    :remote-method="remoteMethod"
    :loadMoreEnd="loadMoreEnd"
    v-bind="$attrs"
    v-on="$attrs"
    @load-more="processloadMore"
  />
</template>
<script setup lang="ts">
import { ref, onMounted, computed, reactive } from 'vue'
import { apiQueryTask } from '@/api/modules/EW.js'
const props = defineProps({
  modelValue: {
    type: String,
    default: '',
  },
})
const emits = defineEmits(['update:modelValue'])
let processKey: any = computed({
  get() {
    return props.modelValue
  },
  set(val) {
    emits('update:modelValue', val)
  },
})
const processArr = ref([])
const loadMoreEnd = ref(false)
const query = reactive({
  current: 1,
  size: 20,
  taskDefKey: '',
  taskName: '',
})
const processloadMore = () => {
  if (loadMoreEnd.value && query.current > 1) return
  query.current++
  getQueryAll()
}

const remoteMethod = (e: string) => {
  console.log('remoteMethod------', query)
  query.current = 1
  query.taskName = e
  processArr.value = []
  getQueryAll(e)
}
const getQueryAll = (key = '') => {
  loadMoreEnd.value = false
  apiQueryTask(query).then((res) => {
    if (res.data.success) {
      processArr.value = processArr.value.concat(res.data.data.result)
      if (query.current * 20 >= res.data.data.count) {
        loadMoreEnd.value = true
      }
    }
  })
}
onMounted(() => {
  getQueryAll()
})
</script>
